<template>
  <div class="data-card">
   
  </div>
</template>

<script>
export default {
  name: 'DataCard',
  
  props: {
    data: {
      type: Object,
      required: true
    }
  }
};
</script>

<style scoped>
.data-card {
  background: white;
  border-radius: 8px;
  padding: 15px;
  margin-bottom: 15px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  transition: box-shadow 0.3s;
}

.data-card:active {
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
}

.card-title {
  font-size: 15px;
  font-weight: 600;
  color: #333;
  margin-bottom: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid #f0f0f0;
}

.card-info {
  margin-bottom: 8px;
  font-size: 13px;
  color: #666;
  line-height: 1.6;
}

.card-info label {
  color: #999;
  margin-right: 5px;
}

.card-actions {
  display: flex;
  gap: 10px;
  margin-top: 15px;
  padding-top: 12px;
  border-top: 1px solid #f0f0f0;
}

.card-actions .el-button {
  flex: 1;
  border-radius: 4px;
}
</style>

